<template>
    <div style="font-size: 12px; line-height: 60px; display: flex">

        <div style="flex: 1; font-size: 20px">
            <span :class="collapseBtnClass" style="cursor: pointer" @click="collapse"></span>

            <el-breadcrumb separator="/" style="display: inline-block;margin-left: 10px">
                <el-breadcrumb-item :to="'/'">首页</el-breadcrumb-item>
                <el-breadcrumb-item>{{currentPath}}</el-breadcrumb-item>

            </el-breadcrumb>

        </div>


    </div>
</template>

<script>
    export default {
        name: "Header",
        props: {
            collapseBtnClass: String,
            // collapse: Boolean,


        }, data() {
            return {

                path: [],
                currentPath: ''
            }
        },
        methods:{
            collapse() {
                this.$parent.$parent.$parent.$parent.collapse()  // 通过4个 $parent 找到父组件，从而调用其折叠方法
                this.$emit("asideCollapse")
            },
            logout(){
                this.$router.push("/login")
                localStorage.removeItem("user")
                sessionStorage.removeItem("user")
                this.$message.success("退出成功")
            }
        },

    }
</script>

<style scoped>

</style>
